<template>
  <base-layout
    :dialog-title="dialogTitle"
    :dialog-visible="dialogVisible"
    dialog-width="600px"
    :page-show="pageShow"
    @dialog-close="dialogClose"
  >
    <template #toolPanel />
    <template #searchPanel>
      <search-panel :show-add-button="false" :show-search-button="true"
                    labelWidth="73" @search="search"   :left="true">
        <el-form-item label="运营商:" prop="operatoruid">
          <el-select v-model="filters.operatorname" clearable style="width: 212px;" collapse-tags filterable placeholder="请选择运营商">
            <el-option value="0" label="全部">全部</el-option>
            <el-option
              v-for="item in operator"
              :key="item.operatoruid"
              :label="item.operatorname"
              :value="item.operatorname">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="分销商:" prop="useruuid">
          <el-select v-model="filters.useruuid" placeholder="请选择分销商" filterable collapse-tags clearable  >
            <el-option value="0" label="全部">全部</el-option>
            <el-option
              v-for="item in users"
              :key="item.user.useruuid"
              :label="item.user.username"
              :value="item.user.useruuid">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="省份:" prop="provinceuuid">
          <el-select v-model="filters.provincename" placeholder="请选择省份" filterable collapse-tags clearable>
            <el-option value="0" label="全部">全部</el-option>
            <el-option
              v-for="item in info"
              :key="item.provinceuuid"
              :label="item.provincename"
              :value="item.provincename">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="开始时间:">
          <el-date-picker type="datetime" placeholder="开始时间" clearable format="yyyy-MM-dd HH:mm:ss"   v-model="filters.starttime" style="width: 100%;"></el-date-picker>
        </el-form-item>
        <el-form-item label="结束时间:">
          <el-date-picker type="datetime" placeholder="结束时间" clearable format="yyyy-MM-dd HH:mm:ss"   v-model="filters.endtime" style="width: 100%;"></el-date-picker>
        </el-form-item>
      </search-panel>
    </template>
    <template #contentPanel>
      <data-table
        :value="tableData"
        :total-count="totalCount"
        :has-action="false"
        :current="start"
        :table-column-attributes="tableColumnAttributes"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      >
        <template #action="{row}">
        </template>
      </data-table>
    </template>

    <template #dialog>
    </template>

  </base-layout>
</template>

<script>
import baseMixin from '@/mixins/base'
import util from '../../../utils/util'
import {findDownOrderCount} from '@/api/countapi'
import {findAllDownShopInfo,findAllPro,findPageOperator} from '@/api/utilsapi'
import moment from 'moment';

export default {
  name: 'uporderlog',
  mixins: [
    baseMixin({
      idName: 'id',
      findData:findDownOrderCount,
      format(res) {
        return res.map(data => {
          return data
        })
      }
    })
  ],
  data() {
    return {
      pageShow: true,
      dialogData:{},
      users:[],
      tableColumnAttributes: [
        //分类	渠道名称	运营商	笔数	充值面值	扣款金额
        { name: '分类', value: 'sumname' },
        { name: '渠道名称', value: 'username' },
        { name: '运营商', value: 'operatorname' },
        { name: '笔数', value: 'sum' },
        { name: '充值面值', value: 'sumprice' },
        { name: '扣款金额', value: 'summoney' }
      ],
      filters: {
        useruuid: '',
        downprouuid:'',
        operatorname:'',
        provincename:'',
        operatoruid:'',
        starttime:moment(new Date(),"YYYY-MM-DD HH:mm:ss").format('YYYY-MM-DD') + " 00:00:00",
        endtime:moment(new Date(),"YYYY-MM-DD HH:mm:ss").format('YYYY-MM-DD') + " 23:59:59"
      },
      operator:[],
      info:[]
    }
  },
  methods: {
    async search(form){
      let para = {
        start: 0,
        pageSize: 10,
        useruuid: this.filters.useruuid == "" || this.filters.useruuid == 0 ? "" : this.filters.useruuid,
        provincename:this.filters.provincename == "" || this.filters.provincename == 0 || this.filters.provincename == "全国" ? "" : this.filters.provincename,
        operatorname:this.filters.operatorname == "" || this.filters.operatorname == 0  ? "" : this.filters.operatorname,
        starttime:(this.filters.starttime == "" || this.filters.starttime == undefined ) ? "" : moment(this.filters.starttime,"YYYY-MM-DD HH:mm:ss").format('YYYY-MM-DD HH:mm:ss'),
        endtime: (this.filters.endtime == "" || this.filters.endtime == undefined) ? "" : moment(this.filters.endtime,"YYYY-MM-DD HH:mm:ss").format('YYYY-MM-DD HH:mm:ss')
      };
      this.searchOptions = para;
      this.setTableData()
    },
    async findAllDownShopInfo(){
      let para = {useruuid: this.$store.getters.useruuid};
      const result = await findAllDownShopInfo(para);
      if(result.data){
        this.users = result.data;
      }
    },
    findAllPro(){
      let para = {useruuid: ''};
      findAllPro(para).then(datas => {
        let {message, code, data} = datas;
        this.info = data;
      });
    },
    async findPageOperator() {
      let para = {
        start: 1,
        pageSize:10,
        operatorname:'',
      };
      const result = await findPageOperator(para);
      if(result.data && result.data.result){
        this.operator = result.data.result;
      }
    },
  },
  mounted() {
    this.findAllDownShopInfo();
    this.findPageOperator();
    this.findAllPro();
  }
}
</script>
